<!--
 * @Descripttion: 用户管理 - 中心审核
 * @version:
 * @Author: 穆宏宇
 * @Date: 2020-09-21 14:43
 * @LastEditors: 穆宏宇
 * @LastEditTime: 2020-11-25 16:21:04
-->
<template>
	<div class="audit">
		<el-row :gutter="10">
			<div class="box-card">
				<el-tabs type="border-card" v-model="userType" @tab-click="tabClick" class="tab-cont">
					<el-tab-pane label="采购人"></el-tab-pane>
					<el-tab-pane label="供应商"></el-tab-pane>
					<div class="topNav asd">
						<e-control :search-form-options="formOptions" :btns="btns" @on-search="onSearch"></e-control>
					</div>
					<!-- 搜索 -->
					<!-- 表格 -->
					<el-table :data="tableData" border  :height="maxHeightNow">
						<el-table-column prop="account" label="登录名"></el-table-column>
						<el-table-column prop="name" label="真实姓名"></el-table-column>
						<el-table-column prop="mobile" label="电话" v-if="userType == 0"></el-table-column>
						<el-table-column prop="contactTel" label="电话" v-if="userType == 1"></el-table-column>
						<el-table-column prop="email" label="邮箱" v-if="userType == 0"></el-table-column>
						<el-table-column prop="email" label="邮箱" v-if="userType == 1"></el-table-column>
						<el-table-column label="角色">
							{{ userType === '0' ? '采购人' : '供应商' }}
						</el-table-column>
						<el-table-column prop="auditStatus" label="审核状态" width="110">
							<template slot-scope="scope">
								<el-tag
									:type=" scope.row.auditStatus === '0' ? 'warning' : scope.row.auditStatus === '1' ? 'success' : 'danger' ">
									{{ scope.row.auditStatus | statusShow }}
								</el-tag>
							</template>
						</el-table-column>
						<el-table-column prop="orgName" label="组织" width="180"></el-table-column>
						<el-table-column fixed="right" label="操作" width="300">
							<template slot-scope="scope">
								<div class="action">
									<el-button type="primary" size="small" @click="detailEvent(scope.row)">查看
									</el-button>
									<el-button :disabled="scope.row.auditStatus !== '0'"
										@click="approveRegEvent(scope.row)" type="success" size="small">审核通过
									</el-button>
									<el-button :disabled="scope.row.auditStatus !== '0'"
										@click="refuseRow(scope.row)" type="danger" size="small">审核不通过
									</el-button>
								</div>
							</template>
						</el-table-column>
					</el-table>
					<!-- 分页 -->
					<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
						:current-page="currentPage" :page-size="pageSize"
						layout="total, sizes, prev, pager, next, jumper" :total="totalPage"></el-pagination>
				</el-tabs>
			</div>
			<!-- </el-col> -->
		</el-row>

		<!-- <el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button> -->
		<el-dialog title="提示" :visible.sync="dialogVisible1" width="30%" :before-close="handleClose1">
			<span>请输入驳回原因</span>
			<el-input v-model="queryParams.refuseDetail" placeholder="请输入" clearable size="small" />
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible1 = false">取 消</el-button>
				<el-button type="primary" @click="exRefuse()">确 定</el-button>
			</span>
		</el-dialog>


		<el-dialog :title="userType === '0' ? '采购人注册信息' : '供应商注册信息'" :visible.sync="dialogVisible" width="600px"
			:before-close="handleClose">
			<div>
				<el-form label-width="120px" label-suffix=":" size="mini">
					<el-row :gutter="20" v-if="userType === '0'">
						<el-col :span="12">
							<el-form-item label="工号">{{detailObj.employeeId}}</el-form-item>
							<el-form-item label="办公电话">{{ detailObj.tel }}</el-form-item>
							<el-form-item label="身份证正面">
								<img :src="detailObj.idCardFront" />
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="所属组织机构">{{detailObj.orgName}}</el-form-item>
							<el-form-item label="身份证号">{{detailObj.idCard}}</el-form-item>
							<el-form-item label="身份证反面">
								<img :src="detailObj.idCardBack" />
							</el-form-item>
						</el-col>
					</el-row>
					<el-row v-else>
						<el-col :span="12">
							<el-form-item label="单位名称">{{
                detailObj.orgNameZh
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="营业执照编码">{{
                detailObj.businessLicenseCode
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="国别代码">{{
                detailObj.countryCode
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="中文简称">{{
                detailObj.orgNameZhShort
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="成立日期">{{
                detailObj.foundationDate | formeTime
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="营业地址">{{ detailObj.addr }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="邮政编码">{{
                detailObj.zipCode
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="联系人手机号">{{
                detailObj.contactTel
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="传真号码">{{ detailObj.fax }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="电子邮箱">{{ detailObj.mail }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="网址">{{ detailObj.website }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="法人代表">{{
                detailObj.legalPerson
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="法人代表身份证/护照编码">{{
                detailObj.legalPersonId
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="注册资本">{{
                detailObj.registeredCapital
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="营业开始时间">{{
                detailObj.openStart | formeTime
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="营业结束时间">{{
                detailObj.openEnd | formeTime
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="注册地址">{{
                detailObj.registeredAddr
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="开户行">{{
                detailObj.bankName
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="开户行账号">{{
                detailObj.bankAccount
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="联系人姓名">{{
                detailObj.contact
              }}</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="营业执照图片">
								<!-- <common-img :fileType="18" :id="detailObj.attachment1" /> -->
								<div v-if="detailObj.businessLicensePic">
									<img :src="detailObj.businessLicensePic" v-if="detailObj.businessLicensePic.indexOf('http') > -1" />
									<img :src="'https://www.ansteelmro.com' + detailObj.businessLicensePic" v-else/>
								</div>
							</el-form-item>
						</el-col>
						<!-- <el-col :span="12">
							<el-form-item label="其他资源" v-if="detailObj.attachment2">
								<common-img :fileType="18" :id="detailObj.attachment2" />
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="其他资源" v-if="detailObj.attachment3">
								<common-img :fileType="18" :id="detailObj.attachment3" />
							</el-form-item>
						</el-col> -->
					</el-row>
				</el-form>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="dialogVisible = false">关闭</el-button>
			</span>
		</el-dialog>
		<!-- 供应商审核通过弹窗 -->
		<el-dialog title="审核通过" :visible.sync="dialogRoleVisible" width="450px" :before-close="handleRoleClose"
			:close-on-click-modal="false" :close-on-press-escape="false">
			<div class="selectRole">
				<el-select v-model="setRole" multiple collapse-tags placeholder="请选择角色">
					<el-option v-for="item in rolesArr" :key="item.id" :label="item.name" :value="item.id">
					</el-option>
				</el-select>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogRoleVisible = false">取 消</el-button>
				<el-button type="primary" @click="confirmRole">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
	import eControl from '@/components/e-control'
	import commonImg from '@/views/admin/components/common-img'
	import {
		formOptions,
		btns
	} from './control'
	import moment from 'moment'
	import {
		updateSupplierRefuseDetail,
		updateRefuseDetail,
		getPurchaserList,
		getpurchaserOrg,
		updateTbizSupplier,
		getPurchaser,
		searchSupplierRegisteredInfor,
		getRoleAll,
		userAddRole,
		selectTBizUserPurchaseList,
		updateTBizUserPurchase,
		selectSupplierList,
		getRoleCon
	} from '@/api/admin.api'
	export default {
		name: 'audit',
		components: {
			eControl,
			commonImg,
		},
		data() {
			return {
				// 用户类型 0 采购人；1 供应商
				queryParams: {
					refuseDetail: ""
				},
				userType: '0',
				dialogVisible1: false,
				formOptions,
				btns,
				dialogRoleVisible: false,
				editDialogTitle: '新增用户',
				editDialogShow: false,
				setRole: ['b9fbb8d75fe946b7abc7e9f3606e1a9c'],
				// 编辑框表单数据
				dialogFormCurrent: {},

				defaultProps: {
					children: 'children',
					label: 'label',
				},
				// 表格数据
				tableData: [],
				currentPage: 1,
				pageSize: 10,
				totalPage: 0,
				// 详情弹窗
				dialogVisible: false,
				// 详情信息
				detailObj: {},
				searchFormData: {},
				rolesArr: [],
				selectObj: {}
			}
		},
		filters: {
			formeTime(val) {
				return val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : ' '
			},
			statusShow(val) {
				const statusTexts = ['审核中', '审核通过', '审核不通过']
				return statusTexts[val]
			},
		},
		computed: {
			// 表单实例
			dialogForm() {
				return this.$refs.dialogForm
			},
			// 表格高度
			maxHeightNow() {
				const height = window.innerHeight
				return height - 350
			},
		},
		created() {
			this.init()
			this.getpurchaserOrgEvent()
		},
		mounted() {},
		methods: {
			refuseRow(row){
				this.dialogVisible1 = true
				this.selectObj = row;
			},
			// 初始化
			init() {
				this.currentPage = 1
				this.pageSize = 10
				// this.searchFormData = {}
				// this.getPurchaserListEvent()
				if (this.userType === '0') {
					//采购
					// this.getpurchaserOrgEvent()
					this.getPurchaserListEvent();
				}else{
					//供应
					this.getSupplierListEvent ()
				}
			},
			// 切换tab
			tabClick(tab) {
				
				if (this.userType == 1) {
					this.formOptions[2].label = "供应商"
				} else {
					this.formOptions[2].label = "组织"
				}
				
				this.searchFormData = {}
				// this.init()
				this.currentPage = 1
				this.pageSize = 10
				if (this.userType === '0') {
					//采购
					// this.getpurchaserOrgEvent()
					this.getPurchaserListEvent();
				}else{
					//供应
					this.getSupplierListEvent ()
				}
			},
			// 查询供应商
			getSupplierListEvent() {
				let params = {
					auditStatus: '',
					pageSize: this.pageSize,
					pageNum: this.currentPage,
					account: this.searchFormData.account,
					name: this.searchFormData.name
				}
				// getPurchaserList(this.userType, params).then((res) => {
				// 	this.tableData = res.records
				// 	this.totalPage = res.total
				// })
			
				selectSupplierList(params).then(res => {
					this.tableData = res.rows;
					this.totalPage = res.total;
				})
			},
			// 查询已注册采购人
			getPurchaserListEvent() {
				let params = {
					auditStatus: '',
					pageSize: this.pageSize,
					pageNum: this.currentPage,
					account: this.searchFormData.account,
					name: this.searchFormData.name,
					orgId: this.searchFormData.id ?
						this.searchFormData.id[this.searchFormData.id.length - 1] : '',
				}
				// getPurchaserList(this.userType, params).then((res) => {
				// 	this.tableData = res.records
				// 	this.totalPage = res.total
				// })

				selectTBizUserPurchaseList(params).then(res => {
					this.tableData = res.rows;
					this.totalPage = res.total;
				})
			},
			// 查询采购人|供应商组织
			getpurchaserOrgEvent() {
				// getpurchaserOrg(this.userType).then((res) => {
				// 	this.formOptions[2].props.options = res
				// 	// 供应商
				// 	if (this.userType == '1') {
				// 		this.formOptions[2].props.props.label = 'orgNameZh'
				// 	} else {
				// 		this.formOptions[2].props.props.label = 'name'
				// 	}
				// })
			},
			// 审核通过
			approveRegEvent(row) {
				if (this.userType === '0') {
					this.approveRegEventPur(row)
				} else {
					this.approveRegEventSup(row)
				}
			},
			// 审核通过
			approveRegEventPur(row) {
				this.$confirm('确定通过此申请吗?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning',
				}).then(() => {
					updateTBizUserPurchase(row).then(res => {
						if (res == 1) {
							this.$message({
								message: '执行成功',
								type: 'success',
							})
							this.init()
							this.getPurchaserListEvent()
						}
					})
				})
			},
			// 审核通过（供应商）前 确认弹窗
			approveRegEventSup(row) {
				this.selectObj = row
				this.queryRolesAll()
				this.dialogRoleVisible = true
			},
			// 审核通过（供应商）
			confirmRole() {
				// console.log(this.setRole);
				// console.log(this.selectObj.id);
				updateTbizSupplier({
					...this.selectObj,
					roleIds:this.setRole
				}).then((res) => {
					if(res>0){
						this.$message({
							message: '审核通过！',
							type: 'warning',
						})
						this.dialogRoleVisible = false;
					}
				}).catch(err => {
					this.$message({
						message: '审核失败！',
						type: 'warning',
					})
				})

			},
			// 获取全部角色
			queryRolesAll() {
				getRoleCon({
					pageNum:1,
					pageSize:10000
				}).then((response) => {
					this.rolesArr = response.rows
				})
			},
			// // 审核拒绝
			// refuseRegEvent(row) {
			// 	this.$confirm('确定拒绝此申请吗?', '提示', {
			// 		confirmButtonText: '确定',
			// 		cancelButtonText: '取消',
			// 		type: 'warning',
			// 	}).then(() => {
			// 		refuseReg(this.userType, row.id).then((res) => {
			// 			this.$message({
			// 				message: '执行成功',
			// 				type: 'success',
			// 			})
			// 			this.init()
			// 			this.getpurchaserOrgEvent()
			// 		})
			// 	})
			// },

			//审批拒绝
			exRefuse() {
				let params = {
					refuseDetail: this.queryParams.refuseDetail,
					id:this.selectObj.id
				}
				//采购人驳回
				if (this.userType === '0') {
					updateRefuseDetail(params).then(res => {
					
					})
				}else{
					//供应商驳回
					updateSupplierRefuseDetail(params).then(res => {
					
					})
				}
				
			},




			handleOther(data) {
				console.log(data)
			},
			handleNodeClick(data) {
				console.log(data)
			},
			handleCheckChange(data, checked, indeterminate) {
				console.log(data, checked, indeterminate)
			},
			handleRoleClose(done) {
				done()
			},
			// 搜索
			onSearch(data) {
				this.searchFormData = data
				this.init()
			},
			// 新增
			onInsert() {
				this.editDialogTitle = '新增用户'
				this.editDialogShow = true
			},
			handleSizeChange(val) {
				this.pageSize = val
				this.getPurchaserListEvent({})
			},
			handleCurrentChange(val) {
				console.log(`当前页: ${val}`)
				this.currentPage = val
				this.getPurchaserListEvent({})
			},
			/**
			 * @functionName closeDialog
			 * @description 关闭编辑框
			 * @author 张航
			 * @date 2020-09-08 14:27:02
			 * @version V1.0.0
			 */
			closeDialog() {
				this.editDialogType = 0
				this.editDialogShow = false
			},
			/**
			 * @functionName cancelDialogData
			 * @description 取消保存弹框数据
			 * @author 张航
			 * @date 2020-09-08 18:17:11
			 * @version V1.0.0
			 */
			cancelDialogDataHandle() {
				this.dialogForm.handleRefresh()
				this.closeDialog()
			},
			/**
			 * @functionName saveDialogData
			 * @description 保存弹框数据
			 * @author 张航
			 * @date 2020-09-08 18:15:14
			 * @version V1.0.0
			 */
			saveDialogDataHandle() {
				const {
					insert: {
						url,
						type = 'GET'
					},
				} = this.interFace
				console.log(this.dialogForm.formData)
				this.interFaceEvent(url, this.dialogForm.formData, type).then((res) => {
					// console.log(res)
					this.dialogForm.handleRefresh()
					this.closeDialog()
					this.$message({
						message: '保存成功',
						type: 'success',
					})
				})
			},
			/**
			 * @functionName interFaceEvent
			 * @param {String|} url 请求地址
			 * @param {Object} data 请求参数
			 * @param {String} type 请求类型，默认为GET
			 * @return {Promise} 返回结果
			 * @description 接口访问
			 * @author 张航
			 * @date 2020-09-14 16:14:51
			 * @version V1.0.0
			 */
			interFaceEvent(url, data, type = 'GET') {
				let _url = url
				const _type = type.toLowerCase()
				if (_type === 'get') {
					_url = _url + this.$tools.urlParam(data)
				}
				return this.$api[_type](_url, data)
			},
			// 查看详情
			detailEvent(item) {
				
				if (item.id) {
					// 用户类型 0 采购人；1 供应商
					if (this.userType === '0') {
						this.detailObj = item
						this.dialogVisible = true
					} else {
						this.detailObj = item
						this.dialogVisible = true
					}
				}
			},





			// 关闭弹窗
			handleClose() {
				this.dialogVisible = false
				this.detailObj = {}
			},
		},
	}
</script>

<style scoped lang="scss">
	.box-card {
		margin: 4px;
		height: calc(100vh - 120px);

		.el-table {
			margin: 20px auto !important;
			width:100% !important;
		}

		.el-pagination {
			text-align: right;
		}
	}

	.abc-header {
		color: #0000ff;
	}

	.abc {
		font-weight: bold;
		color: #e53939;
	}

	.action {
		text-align: left;
	}

	.selectRole {
		padding: 30px;
		box-sizing: border-box;

		.el-select {
			width: 100%;
		}
	}
</style>

<style lang="scss">
	.audit {
		.el-card__body {
			padding: 0 !important;
			height: 100%;
		}

		.el-tabs {
			height: 100%;
		}

		.el-tabs__content {
			.tab-cont {
				height: 100%;
			}
		}
	}
</style>
